<template>
    <!--命名规范
    -- 全局前缀用 qn-开头
       每一个目录的内容页面 最顶层class名称要于文件名相同
       如：home/home.vue  class="home"
       最顶层的class需要再增加一个副类 用于表示页面
       如：home/home.vue  class="qn-page home"
    -- 在写样式的时候 如果是属于该页面的样式
       如：.qn-page.home {}

    -- 内容样式主布局可以使用container aside header content footer
       再命名使用的时候可以使用less默认是使用less，可以自行调整
       如 .qn-page.home{
            .container  {

            }
       }

    -- 内容 二级元素可以使用具体作用域的单词命名，命名跟在一级区块后
       如 .container-article
       三级元素内容同二级命名方式一样
       如 .container-article-title

       子集内容则可以直接使用__开头命名class，
       如 .__header

    -- 通用样式命名以.qn-开头
       如 .qn-button .qn_tag 等等
    -->
    <div class="qn-page home">
        <div class="header">

        </div>
        <div class="content">

        </div>
        <div class="footer">

        </div>
    </div>
</template>
<script type="text/javascript">
export default {
    name: 'home',
    /**
     * 调用组建
     * @type {Object}
     */
    components: {},
    /**
     * 组建属性
     * @type {Object}
     */
    props: {},
    /**
     * 数据字段
     * @return {[type]} [description]
     */
    data() {
        return {}
    },
    /**
     * 计算属性
     * @type {Object}
     */
    computed: {},
    /**
     * 数据监听
     * @type {Object}
     */
    watch: {},
    /**
     * 页面创建时
     * @return {[type]} [description]
     */
    created() {

    },
    /**
     * 页面加载时
     * @return {[type]} [description]
     */
    mounted() {

    },
    /**
     * 页面调用函数
     * @type {Object}
     */
    methods: {}
}
</script>
<style type="text/css" scoped lang="less">

</style>
